﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>陵县供水管网</title>
    <link rel="shortcut icon" href="images/favicon.ico" />
    <link rel="stylesheet" href="http://111.30.72.13/arcgis_js_api/library/3.9/3.9/js/dojo/dijit/themes/claro/claro.css" />
    <link rel="stylesheet" href="http://111.30.72.13/arcgis_js_api/library/3.9/3.9/js/dojo/dojox/layout/resources/FloatingPane.css" />
    <link rel="stylesheet" href="http://111.30.72.13/arcgis_js_api/library/3.9/3.9/js/esri/css/esri.css" />
    <link rel="stylesheet" type="text/css" href="css/sample.css" />
    <!-- HTML5 Shim 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
    <style>
        html, body, #mapDiv
        {
            padding: 0;
            margin: 0;
            width: 100%;
            height: 100%;
        }
        #dijit_layout_ContentPane_0{
            padding:0;
        }
        body
        {
            background-color: #fff;
            overflow: hidden;
            font-family: '微软雅黑';
        }

        ul
        {
            float: right;
            width: 100%;
            padding: 0;
            margin: 0;
            list-style-type: none;
            position: absolute;
            z-index: 99;
        }

            ul a
            {
                float: right;
                width: 7em;
                text-decoration: none;
                color: white;
                background-color: purple;
                padding: 0.2em 0.6em;
                border-right: 1px solid white;
            }

                ul a:hover
                {
                    background-color: #ff3300;
                }
            ul li
            {
                display: inline;
                text-align: center;
            }

        .navbar .brand
        {
            display: block;
            float: left;
            padding: 16px 20px 12px;
            margin-left: -24px;
            font-size: 20px;
            font-weight: bold;
            line-height: 1;
            color: #999;
        }

        #Header
        {
            background-color: #fff;
            font-size: 1em;
            font-family: sans-serif;
            padding-left: 5em;
            padding-top: 1px;
            margin: 1px;
            color: #660000;
        }

        #HomeButton
        {
            position: absolute;
            top: 95px;
            left: 20px;
            z-index: 50;
        }

        #info
        {
            position: absolute;
            left: 0;
            bottom: 0;
            padding: 10px;
            background-color: #ddd;
            font: 14px Segoe UI;
            width: 200px;
            text-align: center;
            border-radius: 0 10px 0 0;
        }

        .btn_bg
        {
            background-image: url(assets/img/titleBackground.jpg);
            -moz-background-size: 100% 100%;
            -o-background-size: 100% 100%;
            -webkit-background-size: 100% 100%;
            background-size: 100% 100%;
        }

        .dj_ie .infowindow .window .top .right .user .content
        {
            position: relative;
        }

        .dj_ie .simpleInfoWindow .content
        {
            position: relative;
        }
        #meta {
            position: absolute;
            right: 0;
            top: 0;
            width: 57em;
            height: 1em;
            z-index: 40;
            /*background: #ffffff;*/
            color: #777777;
            padding: 0;
            border: 0 solid rgba(255, 255, 255, 0.6);
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 0;
            font-size: 0.9em;
        }
        #meta h3 {
            color: #666666;
            font-size: 1.1em;
            padding: 0;
            margin: 0;
            display: inline-block;
        }
        .box {
            margin-top: 5px;
            color: #292929;
            border: 1px solid #9F9F9F;
            background-color: #EFEFEF;
            padding-left: 10px;
            padding-right: 20px;
            margin-left: 10px;
            margin-bottom: 1em;
            border-radius: 10px;

            -o-border-radius: 10px;
            -moz-border-radius: 10px;
            -webkit-border-radius: 10px;
            box-shadow: 8px 8px 16px #adadad;
            -webkit-box-shadow: 8px 8px 16px #adadad;
            -moz-box-shadow: 8px 8px 16px #adadad;
            -o-box-shadow: 8px 8px 16px #adadad;
            overflow: hidden;
        }
    </style>
    <script src="js/jquery-2.1.1.js"></script>
    <script src="js/json2.js"></script>
    <!-- 配置dojo环境，parseOnLoad为true 且要此句要放在 v3.3 init.js前面-->
    <script type="text/javascript">var djConfig = { parseOnLoad: true };</script>
    <script src="http://111.30.72.13/arcgis_js_api/library/3.9/3.9/js/dojo/dojo/dnd/Moveable.js"></script>
    <script src="http://111.30.72.13/arcgis_js_api/library/3.9/3.9/init.js"></script>
    <script type="text/javascript" src="js/InfoTip.js"></script>
    <script type="text/javascript">
        var json;
        var symbol1, symbol01, symbol02,symbolAlarm;  //图示符号
        var map;
        var iTip;  //鼠标悬停变量
        var zdid_i = 0,zdid_j= 0,zdid_k= 0,zdid_l=0;  //水表点，水质点，其它点个数全局变量
        var alarmString="";
        require(["dojo/parser","dijit/registry", "dojo/on","dojo/dom","dojo/dnd/Moveable", "esri/geometry/Extent", "esri/Color", "esri/map", "esri/layers/ArcGISTiledMapServiceLayer",
                    "esri/layers/ArcGISDynamicMapServiceLayer","esri/InfoTemplate","esri/tasks/IdentifyTask","esri/tasks/IdentifyParameters","esri/dijit/Popup",
                    "esri/geometry/Point", "esri/SpatialReference", "esri/graphic", "esri/layers/GraphicsLayer", "esri/symbols/SimpleMarkerSymbol","esri/symbols/SimpleFillSymbol",
                    "esri/symbols/SimpleLineSymbol","dojo/_base/array", "dojo/store/JsonRest", "esri/dijit/HomeButton", "esri/dijit/OverviewMap", "esri/dijit/Scalebar","dojo/dom-construct", "dojo/domReady!"],
                function (parser, registry, on,dom,Moveable,Extent, Color, Map, ArcGISTiledMapServiceLayer,ArcGISDynamicMapServiceLayer,InfoTemplate,
                          IdentifyTask,IdentifyParameters,Popup,Point, SpatialReference, Graphic,GraphicsLayer,  SimpleMarkerSymbol,SimpleFillSymbol,
                          SimpleLineSymbol,arrayUtils, JsonRest, HomeButton, OverviewMap, Scalebar,domConstruct) {
                    //parser.parse(); //与djConfig = { parseOnLoad: true } 重复，目前可以不用设置此项，以后是否会需要，在看
                    var extent = new Extent({
                        "xmin": 456188, "ymin": 4130176,
                        "xmax": 462876, "ymax": 4133936,
                        "spatialReference": { "wkid": 4214 }  //4214  GEOGCS["GCS_Beijing_1954",DATUM["D_Beijing_1954",SPHEROID["Krasovsky_1940",6378245.0,298.3]],PRIMEM["Greenwich",0.0],UNIT["Degree",0.0174532925199433]]
                    });
                    map = new Map("mapDiv", {
                        extent: extent,
                        logo: false,
                        //center: [467424.1525, 4136804.3113],
                        zoom: 2,
                        infoWindow: popup
                    });
                    //Home按钮
                    var home = new HomeButton({
                        map: map
                    }, "HomeButton");
                    home.startup();
                    //鹰眼
                    var overviewMapDijit = new OverviewMap({
                        map: map,  //必要的
                        attachTo: "bottom-right", //放置位置
                        color: "#D84E13", //设置颜色
                        opacity: .40,  //透明度
                        visible: true,  //初始化可见
                        width: 250,  //默认值是地图高度的 1/4th
                        height: 210,  // 默认值是地图高度的 1/4th
                        //maximizeButton:true,   // 最大化,最小化按钮，默认false
                        expandFactor: 1.5 //概览地图和总览图上显示的程度矩形的大小之间的比例。默认值是2，这意味着概览地图将至少是两倍的大小的程度矩形。
                    });
                    overviewMapDijit.startup();
                    //比例尺
                    var scalebar = new Scalebar({
                        map: map,
                        // "dual" displays both miles and kilmometers
                        // "english" is the default, which displays miles
                        // use "metric" for kilometers
                        scalebarUnit: "metric",
                        attachTo: "bottom-left"
                    });
                    var agoServiceURL = "http://111.30.72.13:6080/arcgis/rest/services/陵县供水管网20151108/MapServer";
                    var agoLayer = new ArcGISTiledMapServiceLayer(agoServiceURL);
                    //底图map
                    map.addLayer(agoLayer);

                    //管线查询
                    var identifyTask, identifyParams;  //定义查询变量
                    var popup = new Popup({
                        fillSymbol: new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
                                new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
                                        new Color([255, 0, 0]), 2), new Color([255, 255, 0, 0.25]))
                    }, domConstruct.create("div"));
                    map.on("load", mapReady);
                    var parcelsURL = "http://111.30.72.13:6080/arcgis/rest/services/陵县供水管网动态管线/MapServer";
                    map.addLayer(new ArcGISDynamicMapServiceLayer(parcelsURL,
                            { opacity: 1 }));
                    function mapReady () {
                        map.on("click", executeIdentifyTask);
                        //create identify tasks and setup parameters
                        identifyTask = new IdentifyTask(parcelsURL);
                        identifyParams = new IdentifyParameters();
                        identifyParams.tolerance = 3;
                        identifyParams.returnGeometry = true;
                        identifyParams.layerIds = [1];  //定义要查询的layerID  [0,1,2]
                        identifyParams.layerOption = IdentifyParameters.LAYER_OPTION_ALL;
                        identifyParams.width = map.width;
                        identifyParams.height = map.height;
                    }
                    function executeIdentifyTask (event) {
                        identifyParams.geometry = event.mapPoint;
                        identifyParams.mapExtent = map.extent;

                        var deferred = identifyTask
                                .execute(identifyParams)
                                .addCallback(function (response) {
                                    return arrayUtils.map(response, function (result) {
                                        var feature = result.feature;
                                        var layerName = result.layerName;
                                        feature.attributes.layerName = layerName;
                                        if (layerName === '供水管网') {
                                            var taxParcelTemplate = new InfoTemplate("供水管网数据",
                                                    "起点X坐标：${SX}<br/>起点Y坐标：${SY}<br/>终点X坐标：${EX}<br/>终点Y坐标：${EY}<br/> 长度: ${L}米 <br/>管径：${R}<br/>材质：${M}");
                                            feature.setInfoTemplate(taxParcelTemplate);
                                        }
                                        /*else if (layerName === 'Building Footprints') {
                                            console.log(feature.attributes.PARCELID);
                                            var buildingFootprintTemplate = new InfoTemplate("",
                                                    "Parcel ID: ${PARCELID}");
                                            feature.setInfoTemplate(buildingFootprintTemplate);
                                        }*/
                                        return feature;
                                    });
                                });
                        map.infoWindow.setFeatures([deferred]);
                        map.infoWindow.show(event.mapPoint);
                    }

                    //添加多个图层到map
                     //创建图形图层
                     sbLayer = new GraphicsLayer();
                     //把图层添加到地图上
                     map.addLayer(sbLayer);
                     szLayer=new GraphicsLayer();
                     map.addLayer(szLayer);
                     alarmLayer=new GraphicsLayer();
                     map.addLayer(alarmLayer);
                    iTip = new InfoTip("i2Div", "infoTip white", map.position, true);
                    //infoWindow模板
                    var infoTemplate = new InfoTemplate("${didianming}", "${fubiaozhi}", "${guanwangyali}");
                    symbol1 = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE,12,new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,new Color([0, 0, 255, 0.9]),1),new Color([0, 0, 255]));
                    symbol01 = new esri.symbol.PictureMarkerSymbol("images/sbjcd-ico.png", 18, 18);
                    symbol02 = new esri.symbol.PictureMarkerSymbol("images/szjcd-ico.png", 18, 18);
                    symbolAlarm= new esri.symbol.PictureMarkerSymbol("images/alarm.png",20,20);

                    map.on("load", addPointGraphics);
                    map.on("load",addAlarmPointGraphics);  //初始化地图时加载报警点  --报警点为动态点，应该改为手动点击按钮实现加载
                    // close the info window when the map is clicked
                    map.on("click", cleanUp);
                    // close the info window when esc is pressed
                    map.on("key-down", function (e) {
                        if (e.keyCode === 27) {
                            cleanUp();
                        }
                    });
                    //显示地图坐标
                    map.on('mouse-move', showCoordinates);
                    map.on('mouse-drag', showCoordinates);

                    //显示地图坐标
                    function showCoordinates(evt) {
                        var mp = evt.mapPoint;
                        dojo.byId("XYinfo").innerHTML = "坐标：" + mp.x.toFixed(4) + " , " + mp.y.toFixed(4);  //toFiex(2) 限制小数点后显示的位数
                    }
                    //将水表点水质点加入地图中
                    function addPointGraphics() {
                        $.ajax({
                            type: "GET",
                            url: "http://222.133.60.178:809/getAllPoints.ashx",//http://222.133.60.178:809/
                            async: false,
                            dataType: "jsonp",
                            jsonp: "callbackparam",
                            jsonpCallback: "success_jsonpCallback",
                            success: function (response) {
                                var json = response;
                                var str = '';

                                for (var i = 0, l = json.length; i < l; i++) {
                                    if(json[i].ZBX > 400000) {
                                        var attr = {
                                            "ZDBH": json[i].ZDBH,
                                            "ZDID": json[i].ZDID,
                                            "ZDMS": json[i].ZDMS,
                                            "XSZT": json[i].XSZT
                                        };
                                        if ((json[i].ZDID < 500 && json[i].ZDID > 0) || json[i].ZDID > 600) {
                                            symbol = symbol01;
                                            zdid_i += 1;
                                            var loc = new Point(json[i].ZBX, json[i].ZBY, new SpatialReference(map.spatialReference));
                                            var graphic = new Graphic(loc, symbol, attr, infoTemplate);
                                            //map.graphics.add(graphic);
                                            sbLayer.add(graphic);
                                        } else if (json[i].ZDID >= 500 && json[i].ZDID <= 600) {
                                            symbol = symbol02;
                                            zdid_j += 1;
                                            var loc = new Point(json[i].ZBX, json[i].ZBY, new SpatialReference(map.spatialReference));
                                            var graphic = new Graphic(loc, symbol, attr, infoTemplate);
                                            //map.graphics.add(graphic);
                                            szLayer.add(graphic);
                                        } else {
                                            symbol = symbol3;
                                            zdid_k += 1;
                                        }
                                    }
                                    /*var loc = new Point(json[i].ZBX, json[i].ZBY, new SpatialReference(map.spatialReference));
                                    var graphic = new Graphic(loc, symbol, attr, infoTemplate);
                                    map.graphics.add(graphic);*/
                                }
                                sbLayer.hide();  //初始化后隐藏水表点层
                                szLayer.hide();  //初始化后隐藏水质点层
                                //document.getElementById("Sbjc_Point_Value").innerHTML=String(zdid_i);
                                //document.getElementById("Szjc_Point_Value").innerHTML=String(zdid_j);
                                console.log("0<ZDID< 500||ZDID > 600 个数为："+zdid_i+"   ||||     "+"ZDID >= 600个数为："+zdid_j+"   其他情况个数："+zdid_k+"  ZDID总个数为："+json.length);
                            },
                            error: function (ex) {
                                //alert(ex);
                                alert('fail');
                                //console.log(ex);
                            }
                        });
                        //map.graphics.on("click", g_onMouseClick);
                        //map.graphics.on("mouse-over", g_onMouseOverHandler);
                        //map.graphics.on("mouse-out", g_onMouseOutHandler);
                        sbLayer.on("click", g_onMouseClick);
                        sbLayer.on("mouse-over", g_onMouseOverHandler);
                        sbLayer.on("mouse-out", g_onMouseOutHandler);
                        szLayer.on("click", g_onMouseClick);
                        szLayer.on("mouse-over", g_onMouseOverHandler);
                        szLayer.on("mouse-out", g_onMouseOutHandler);
                    }
                    //将报警点加入地图中
                    var initAlarmLayer=0;
                    function addAlarmPointGraphics() {
                            console.log("进入添加alarm数据方法");
                        $.ajax({
                            type: "GET",
                            //url: "http://222.133.60.178:809/getAllAlarm.ashx",//http://222.133.60.178:809/
                            url: "getAllAlarm.ashx",//http://222.133.60.178:809/
                            async: false,
                            dataType: "jsonp",
                            jsonp: "callbackparam",
                            jsonpCallback: "success_jsonpCallback",
                            success: function (response) {
                                var json = response;
                                if (json.indexOf("error") > 0) {
                                    alert(response);
                                    return false;
                                }
                                //alert("报警ajax成功");
                                initAlarmLayer+=1;
                                alarmString="";
                                for (var i = 0, l = json.length; i < l; i++) {
                                    if(json[i].ZBX > 400000) {
                                        var attr = {
                                            "ZDBH": json[i].ZDBH,
                                            "ZDID": json[i].ZDID,
                                            "ZDMS": json[i].ZDMS,
                                            "XSZT": json[i].XSZT
                                        };
                                            symbol = symbolAlarm;
                                            zdid_l += 1;
                                            var loc = new Point(json[i].ZBX, json[i].ZBY, new SpatialReference(map.spatialReference));
                                            var graphic = new Graphic(loc, symbol, attr, infoTemplate);
                                            //map.graphics.add(graphic);
                                            alarmLayer.add(graphic);
                                    }
                                    /*var loc = new Point(json[i].ZBX, json[i].ZBY, new SpatialReference(map.spatialReference));
                                     var graphic = new Graphic(loc, symbol, attr, infoTemplate);
                                     map.graphics.add(graphic);*/
                                    //console.log("报警点信息："+"ZBX:"+json[i].ZBX+" | ZBY:"+json[i].ZBY+" | ZDBH:"+json[i].ZDBH,"| ZDID:"+json[i].ZDID," | ZDMS:"+ json[i].ZDMS," | XSZT:"+ json[i].XSZT+"\n");
                                    //console.log(json[i]+"\n");
                                    alarmString += "报警点信息："+"ZBX:"+json[i].ZBX+" | ZBY:"+json[i].ZBY+" | ZDBH:"+json[i].ZDBH,"| ZDID:"+json[i].ZDID," | ZDMS:"+ json[i].ZDMS," | XSZT:"+ json[i].XSZT+"<br> <br>";
                                }
                                //alarmString += "报警点信息："+"ZBX:"+json[i].ZBX+" | ZBY:"+json[i].ZBY+" | ZDBH:"+json[i].ZDBH,"| ZDID:"+json[i].ZDID," | ZDMS:"+ json[i].ZDMS," | XSZT:"+ json[i].XSZT+"\n\n";
                                //alarmLayer.hide();
                                if (initAlarmLayer==1){
                                    alarmLayer.hide();
                                }else{
                                    alarmLayer.show();
                                }

                            },
                            error: function (ex) {
                                //alert(ex);
                                //alert('fail');  //有个问题，第一次ajax能正常显示，第二次以后就会出错，可能是没有消除ajax连接的原因？
                                console.log(ex+"   alarm失败 。");
                            }
                        });
                        alarmLayer.on("click", g_onAlarmMouseClick);
                        alarmLayer.on("mouse-over", g_onMouseOverHandler);
                        alarmLayer.on("mouse-out", g_onMouseOutHandler);
                    }
                    //获取图层控制节点
                    var list_item_1 = document.getElementById("list_item_1");
                    var list_item_2 = document.getElementById("list_item_2");
                    list_item_1.addEventListener("change", function (evt){
                        var chk = evt.target.checked;
                        if (chk) {
                            sbLayer.show();
                            document.getElementById("Sbjc_Point_Value").innerHTML=String(zdid_i);
                            console.log("显示水表点层");
                        }
                        else {
                            document.getElementById("Sbjc_Point_Value").innerHTML="0";
                            sbLayer.hide();
                            cleanUp();
                            console.log("隐藏水表点层");
                        };
                    });
                    list_item_2.addEventListener("change", function (evt){
                        var chk = evt.target.checked;
                        if (chk) {
                            szLayer.show();
                            document.getElementById("Szjc_Point_Value").innerHTML=String(zdid_j);
                            console.log("显示水质点层");
                        }
                        else {
                            document.getElementById("Szjc_Point_Value").innerHTML="0";
                            szLayer.hide();
                            cleanUp();
                            console.log("隐藏水质点层");
                        };
                    });
                    //绑定提示框
                    function g_onMouseClick(evt) {
                        if (evt.graphic.attributes) {
                            var ss = evt.graphic.attributes;
                            msg(ss, evt);
                            setMapCenter(evt,3);
                        }
                    }
                    //绑定报警提示框
                    function g_onAlarmMouseClick(evt){
                        if (evt.graphic.attributes) {
                            var ss = evt.graphic.attributes;
                            alarmMsg(ss, evt);
                            setMapCenter(evt,3);
                        }
                    }
                    //提示框方法
                    function msg(ss, evt) {
                        var mainid = ss.ZDID;
                        var maincode = ss.ZDBH;
                        var mainstate = ss.XSZT;//元素的状态
                        var data =
                        {
                            ZDID: mainid,
                            ZDBH: maincode,
                            XSZT: mainstate
                        };
                        //alert(dataPath);
                        if (mainstate == 0) { mainstate = 100; }
                        //mainid=504;
                        //mainstate=2;
                        var dataPath = '?ZDID=' + mainid + '&ZDBH=' + maincode + '&XSZT=' + mainstate;
                        var ashx = '';
                        if ((mainid < 500 || mainid >= 600) && mainstate == 100) {
                            ashx = 'http://222.133.60.178:809/getPoint.ashx' + dataPath;//http://222.133.60.178:809/
                        }
                        else {
                            ashx = 'http://222.133.60.178:809/getLine.ashx' + dataPath;//http://222.133.60.178:809/
                        }
                        //alert(ashx);
                        $.ajax({
                            type: "GET",
                            url: ashx,
                            async: false,
                            dataType: "jsonp",
                            jsonp: "callbackparam",
                            jsonpCallback: "success_jsonpCallback",
                            success: function (response) {
                                //console.log(response);
                                if (response.indexOf("error:") > 0) {
                                    map.infoWindow.setTitle("发生错误");//设置标题
                                    map.infoWindow.setContent("错误明细:" + response);
                                    return false;
                                }
                                var json = response[0];//jQuery.parseJSON(response);
                                //alert(json.JS);
                                var str = '';
                                map.infoWindow.setTitle("地点名称： " + ss.ZDMS);//设置标题
                                if ((mainid < 500 || mainid >= 600) && mainstate == 100) {
                                    map.infoWindow.setContent("设备号:" + maincode + "<br/> 记录时间:" + json.SJ + "<br/> 管网主表流量:" + json.lx_324 + "m³<br/> 管网副表流量:" + json.lx_325 + "m³<br/> 管网压力:" + ((json.lx_326-40)/100).toFixed(3) + "Mpa<br/> 管网电瓶电压:" + (json.lx_327/10).toFixed(1) + "VDC<br/>瞬时流量:" + json.SSLL+"m³");
                                }
                                else {
                                    //xian
                                    if (mainstate == 1) {
                                        map.infoWindow.setContent("设备号:" + maincode + "<br/> 记录时间:" + json.SJ + "<br/> 总氯（二氧化氯）:" + json.lx_328 + "<br/> 余氯:" + json.lx_329 + "<br/> 浊度:" + json.lx_330 + "<br/> PH值:" + json.lx_331);
                                    }
                                    else {
                                        map.infoWindow.setContent("设备号:" + maincode + "<br/> 记录时间:" + json.SJ + "<br/> ORP:" + json.lx_332 + "<br/> 电导率:" + json.lx_333);
                                    }
                                }
                                map.infoWindow.show(evt.screenPoint);//启动提示框
                                //alert(str);
                            },
                            error: function (ex) {
                                //alert(ex);
                                //alert('fail');
                                console.log(ex + "   mainstate: " + mainstate);
                            }
                        });
                    }
                    //报警信息提示框方法
                    function alarmMsg(ss,evt){
                        var mainid = ss.ZDID;
                        var maincode = ss.ZDBH;
                        var mainstate = ss.XSZT;//元素的状态
                        var data =
                        {
                            ZDID: mainid,
                            ZDBH: maincode,
                            XSZT: mainstate
                        };
                        if (mainstate == 0 || mainstate == "0") { mainstate = 100; }
                        var dataPath = '?ZDID=' + mainid + '&ZDBH=' + maincode + '&XSZT=' + mainstate;
                        //console.log('http://222.133.60.178:809/getAlarm.ashx'+dataPath);
                        var ashx = '';

                        $.ajax({
                            type: "GET",
                            //url:  'http://222.133.60.178:809/getAlarm.ashx'+dataPath,
                            url:  'getAlarm.ashx'+dataPath,
                            async: false,
                            dataType: "jsonp",
                            jsonp: "callbackparam",
                            jsonpCallback: "success_jsonpCallback",
                            success: function (response1) {
                                console.log("response1返回的值为:"+response1);
                                if (response1.indexOf("error:") > 0) {
                                    map.infoWindow.setTitle("发生错误");//设置标题
                                    map.infoWindow.setContent("错误明细:" + response);
                                    return false;
                                }
                                var myDate = new Date();
                                //alert("ajax成功，进入方法");
                                map.infoWindow.setTitle("报警地点名称： " + ss.ZDMS);//设置标题
                                var t0 = "", t1 = "", t2 = "", t3 = "", t4 = "", t5 = "", t6 = "";
                                var mainidIndex = 0;
                                for (var i = 0; i < response1.length; i++) {
                                    mainidIndex++;
                                    var json1 = response1[i];//jQuery.parseJSON(response);
                                    var attType = json1.RELA;
                                    //console.log("attType值为："+attType);
                                    var alarmText = "";
                                    if ((mainid < 500 || mainid >= 600) && mainstat1e == 100 && mainidIndex < 2) {
                                        console.log("mainid值为："+mainid);
                                        switch (maincode) {
                                            case "12042001003":
                                                alarmText = "设备号:" + maincode + "<br/> 记录时间:" + myDate.toLocaleString() + "<br/> 管网主表流量:" + 3699.00
                                                + "m³<br/> 管网副表流量:" + 52173 + "m³<br/> 管网压力:" + 0.190 + "Mpa<br/> 管网电瓶电压:" + 130
                                                + "VDC<br/> 瞬时流量:" + 0.00 + "m³<br><br><strong>以下是报警数值</strong><br>";
                                                break;
                                            case "12042001014":
                                                alarmText = "设备号:" + maincode + "<br/> 记录时间:" + myDate.toLocaleString() + "<br/> 管网主表流量:" + 3699.00
                                                + "m³<br/> 管网副表流量:" + 52173 + "m³<br/> 管网压力:" + 59 + "Mpa<br/> 管网电瓶电压:" + 130
                                                + "VDC<br/>瞬时流量:" + 0.00 + "m³<br><br><strong>以下是报警数值</strong><br>";
                                                break;
                                            case "12042001266":
                                                alarmText = "设备号:" + maincode + "<br/> 记录时间:" + myDate.toLocaleString() + "<br/> 管网主表流量:" + 3699.00
                                                + "m³<br/> 管网副表流量:" + 52173 + "m³<br/> 管网压力:" + 59 + "Mpa<br/> 管网电瓶电压:" + 130
                                                + "VDC<br/>瞬时流量:" + 0.00 + "m³<br><br><strong>以下是报警数值</strong><br>";
                                                break;
                                            default:
                                                alarmText = "设备号:" + maincode + "<br/> 记录时间:" + json1.SJ + "<br/> 管网主表流量:" + json1.lx_324
                                                + "m³<br/> 管网副表流量:" + json1.lx_325 + "m³<br/> 管网压力:" + json1.lx_326 + "Mpa<br/> 管网电瓶电压:" + json1.lx_327
                                                + "VDC<br/>瞬时流量:" + json1.SSLL + "m³<br><br><strong>以下是报警数值</strong><br>";
                                        }
                                                                                
                                    }
                                    else {
                                        //if (mainstate == 1) {
                                        //    "<br/> 总氯（二氧化氯）:" + json1.lx_328
                                        //            + "<br/> 余氯:" + json1.lx_329 + "<br/> 浊度:" + json1.lx_330 + "<br/> PH值:" + json1.lx_331+"<br/>";
                                        //}
                                        //else {
                                        //    alarmText = "<br/> ORP:" + json1.lx_332 + "<br/> 电导率:" + json1.lx_333 + "<br/>";
                                        //}
                                        if (mainstate == 1) {
                                            "<br/> 总氯（二氧化氯）:" + "0.02"
                                                    + "<br/> 余氯:" + "0.01" + "<br/> 浊度:" + "0.002" + "<br/> PH值:" + "0.6"+"<br/>";
                                        }
                                        else {
                                            alarmText = "<br/> ORP:" + "0.02" + "<br/> 电导率:" + "0.9" + "<br/>";
                                        }
                                    }
                                    switch (attType) {
                                        case "0":
                                            t0+=alarmText + "正常数值" + json1.XMMC + "等于" + json1.SETVA1 + "<br/>" + "<b><span>报警数值" + json1.XMMC + "等于" + json1.TRVA + "</span></b><br><br>";
                                                console.log("case 0");
                                            break;
                                        case "1":
                                            t1+=alarmText + "正常数值" + json1.XMMC + "大于" + json1.SETVA1 + "<br/>" + "<b><span style='color;red;'>报警数值" + json1.XMMC + "等于" + json1.TRVA + "</span></b><br><br>";
                                            console.log("case 1");
                                            break;
                                        case "2":
                                            t2+=alarmText + "正常数值" + json1.XMMC + "大于等于" + json1.SETVA1 + "<br/>" + "<b><span style='color;red;'>报警数值" + json1.XMMC + "等于" + json1.TRVA + "</span></b><br><br>";
                                            console.log("case 2");
                                            break;
                                        case "3":
                                            t3+=alarmText + "正常数值" + json1.XMMC + "小于" + json1.SETVA1 + "<br/>" + "<b><span style='color;red;'>报警数值" + json1.XMMC + "等于" + json1.TRVA + "</span></b><br><br>";
                                            console.log("case 3");
                                            break;
                                        case "4":
                                            t4+=alarmText + "正常数值" + json1.XMMC + "小于等于" + json1.SETVA1 + "<br/>" + "<b><span style='color;red;'>报警数值" + json1.XMMC + "等于" + json1.TRVA + "</span></b><br><br>";
                                            console.log("case 4");
                                            break;
                                        case "5":
                                            t5+=alarmText + "正常数值" + json1.XMMC + "不在" + json1.SETVA1 + "和" + json1.SETVA2 + "区间范围内<br/>" + "<b><span style='color;red;'>报警数值" + json1.XMMC + "等于" + json1.TRVA + "</span></b><br><br>";
                                            console.log("case 5");
                                            break;
                                        case "6":
                                            t6+=alarmText + "正常数值" + json1.XMMC + "在" + json1.SETVA1 + "和" + json1.SETVA2 + "区间范围内<br/>" + "<b><span style='color;red;'>报警数值" + json1.XMMC + "等于" + json1.TRVA + "</span></b><br><br>";
                                            console.log("case 6");
                                            break;
                                        default:
                                            console.log("没有case值符合");
                                            map.infoWindow.setContent("<br><span>无</span><br>");
                                            break
                                    }
                                    map.infoWindow.setContent(t0+t1+t2+t3+t4+t5+t6);
                                    //map.infoWindow.show(evt.screenPoint);//启动提示框
                                }
                                map.infoWindow.show(evt.screenPoint);//启动提示框
                            },
                            error: function (ex) {
                                //alert(ex);
                                //alert('fail');
                                console.log(ex);
                            }
                        });
                    }

                    //鼠标悬停提示框
                    function g_onMouseOverHandler(evt) {
                        if (evt.graphic.attributes) {
                            var img = '<img src="images/i_flag.png"/ style="height:20px;width20px;border:0;">';
                            iTip.setContent(img + "&nbsp;" + evt.graphic.attributes.ZDMS);
                            iTip.show(evt.screenPoint);
                        }
                        //console.log(evt.graphic.attributes);
                    }
                    //鼠标离开取消提示框
                    function g_onMouseOutHandler(evt) {
                        iTip.hide();
                    }
                    //移除graphic
                    function RemoveGraphics(){
                        cleanUp();
                        //map.graphics.hide();
                        map.graphics.clear();
                    }
                    //清除弹框
                    function cleanUp() {
                        map.infoWindow.hide();
                    }
                    //将点平移到map正中 (并 缩放到制定map级别)
                    function setMapCenter(evt, level) {
                        var location = new esri.geometry.Point(evt.mapPoint.x,evt.mapPoint.y, map.spatialReference)  //evt.mapPoint.y-5000 将y值向上提高5000m
                        //map.centerAndZoom(location, level);   //将点平移到map正中 并 缩放到制定map级别
                        map.centerAt(location);  //将点平移到map正中
                    }


                    //加载报警历史点数据模块  需要dojo/on 和dojo/dom 两个模块
                     on(dom.byId('btnAlarmHistory'), "click", function () {
                         //alert("添加Alarm 窗口"+"\n\n"+"后续需要添加alarm点数据的接口");
                         if (alarmLayer.visible) {
                            alarmLayer.hide();
                             alarmLayer.clear();
                          } else {
                             addAlarmPointGraphics();  //获取报警点的时间为 点击该报警按钮
                             sbLayer.hide();
                             szLayer.hide();
                             list_item_1.checked=false;
                             list_item_2.checked=false;
                             makeAlarmBox();
                             cleanUp();
                             RemoveGraphics();
                          }
                     });
                }
        );

        //弹出报警点数据对话框
        function makeAlarmBox(){
            require(["dojo/request", "dojo/_base/window", "dojo/dom-style", "dojox/layout/FloatingPane"], function (request, win, style, FloatingPane) {
                var floaterDiv = document.createElement("div");
                win.body().appendChild(floaterDiv);
                floaterDiv.appendChild(document.createElement("br"));
                var textarea = document.createElement("div");
                textarea.innerHTML = "加载...";

                floaterDiv.appendChild(textarea);
                var tmp = new FloatingPane({
                    title: "<b>陵县GIS报警监测记录</b>",
                    id: "aboutBox",
                    closeable: true,
                    resizable: true,
                    dockable: false,
                    resizeAxis: 'xy'
                }, floaterDiv);
                tmp.startup();

                tmp.resize({
                    w: 300,
                    h: 400
                });

                style.set(tmp.domNode, "top", "100px");
                style.set(tmp.domNode, "left", "100px");
                style.set(tmp.domNode, "z-index", "500");

                tmp.show();
                //请求数据源
                /*request("about.html").then(function (response) {
                            textarea.innerHTML = response;
                        },
                        function (response) {
                            //alert("出错，原因是" + response);
                            textarea.innerHTML = '不能找到指定的HTML ';
                        });*/
                //直接获取全局变量当数据源
                textarea.innerHTML=alarmString;

                tmp.bringToTop();
            });
        }
    </script>
</head>
<body class="claro">

    <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width: 100%; height: 100%; margin: 0;">

        <div class="btn_bg" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'" >
            <!--<img src="" style="position: absolute;right: 0px; overflow: hidden; top: 0px; height: 68px"/>-->
            <div style="float: left; display: block; font-size: 30px; z-index: auto; padding: 20px 25px; color: #1f1f1f;"><strong>陵城区供水管网GIS系统</strong></div>
        </div>
        <div id="mapDiv" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" style="padding: 0; position: relative; height: 100%;">
            <div id="meta">
                <ul >
                    <li style="text-align: left;"><a href="#" style="width: 200px;;">
                        <span>图层列表 :</span>
                        <div><img src='images/sbjcd-ico.png' style='width: 22px; height: 22px' />
                            <input type="checkbox"  class="list_item" id="list_item_1"/>
                            <label for="list_item_1">在线水表监测点</label><span id="Sbjc_Point_Value">0</span></div>
                        <div><img src='images/szjcd-ico.png' style='width: 22px; height: 22px' />
                            <input type="checkbox"  class="list_item"  id="list_item_2"/>
                            <label for="list_item_2">在线水质监测点</label><span id="Szjc_Point_Value">0</span></div>
                    </a></li>

                    <li><a href="#">巡检车监控</a></li>
                    <li><a href="#"><span id="btnAlarmHistory">报警历史</span></a></li>
                    <li><a href="#" style="width: auto;" onclick="gifalert();">水源引水示意图</a></li>
                    <li><a href="#">水质监测</a></li>
                    <li><a href="#">水表监测</a></li>
                </ul>
            </div>
            <div id="HomeButton"></div>
            <span id="XYinfo" style="background-color: whitesmoke; font-weight: bolder; font-size: smaller; position: absolute; padding: 2px; left: 20px; bottom: 2px; z-index: 99;"></span>
        </div>
    </div>

    <script language="javascript" type="text/javascript">
        function gifalert(){
            window.open("gif.html","","dialogWidth=840px;dialogHeight=auto;status=no;help=no;");
        }
    </script>

</body>
</html>
